<template>
  <div class="app-container">
    <div id="data">
      <el-row>
        <el-col :span="21">
          <el-date-picker
            v-model="value1"
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          >
          </el-date-picker>
        </el-col>
        <el-col :span="3">
          <el-button @click="download">导出</el-button>
          <el-button type="primary" @click="toGraphical" plain
            >查看图形</el-button
          >
        </el-col>
      </el-row>

      <el-row style="margin-top: 35px">
        <el-col :span="4">
          <strong>版本名称</strong>
        </el-col>
        <el-col :span="3">
          <strong>计划周期</strong>
        </el-col>
        <el-col :span="3">
          <strong>计划时长</strong>
        </el-col>
        <el-col :span="2">
          <strong>开发负责人</strong>
        </el-col>
        <el-col :span="2">
          <strong>测试负责人</strong>
        </el-col>
        <el-col :span="2">
          <strong>未解决Bug数</strong>
        </el-col>
        <el-col :span="2">
          <strong>当日新增Bug</strong>
        </el-col>
        <el-col :span="2">
          <strong>执行进度</strong>
        </el-col>
        <el-col :span="2">
          <strong>状态</strong>
        </el-col>
        <el-col :span="2">
          <strong>备注</strong>
        </el-col>
      </el-row>

      <el-row
        v-for="(v, i) of iteraction_version_extension"
        :key="v.version_id"
        type="flex"
        align="middle"
        style="margin-top: 35px"
      >
        <el-col :span="4">
          <el-checkbox
            v-model="checkeds[i]"
            style="margin-right: 15px"
          ></el-checkbox>
          <a>{{ v.version_name }}</a>
        </el-col>
        <el-col :span="3">
          <span>
            {{ v.plan_cycle }}
          </span>
        </el-col>
        <el-col :span="3">
          <span>{{ v.plan_date_duration }}</span>
        </el-col>
        <el-col :span="2">
          <span>{{ v.dev_leader }}</span>
        </el-col>
        <el-col :span="2">
          <span>{{ v.test_leader }}</span>
        </el-col>
        <el-col :span="2">
          <span>{{ v.unsolved_bug_total }}</span>
        </el-col>
        <el-col :span="2">
          <span>{{ v.this_day_bug_add }}</span>
        </el-col>
        <el-col :span="2">
          <span>{{ v.execute_progress }}</span>
        </el-col>
        <el-col :span="2">
          <span>{{ v.execute_status }}</span>
        </el-col>
        <el-col :span="2">
          <el-input
            size="mini"
            v-model="v.remark"
            placeholder="请输入"
          ></el-input>
        </el-col>
      </el-row>
      <hr />
    </div>
  </div>
</template>

<script>
import * as projectData from "@/api/projectData";

export default {
  data() {
    return {
      radio: 3,
      value1: "",
      input: "",
      radio2: "全部",
      select: null,
      checkeds: [],
      iteraction_version_extension: [],
    };
  },
  methods: {
    download() {
      let params = [];
      for (let v in this.checkeds) {
        if (this.checkeds[v]) {
          params.push(this.iteraction_version_extension[v].version_id);
        }
      }
      projectData
        .downloadVer({
          version_ids: params,
        })
        .then((res) => {
          let blob = res;
          let reader = new FileReader();
          reader.readAsDataURL(blob);
          reader.onload = (e) => {
            let a = document.createElement("a");
            a.download = "version_file.csv";
            a.href = e.target.result;
            document.body.appendChild(a);
            a.click();
            document.body.removeChild(a);
          };
        });
    },
    async subsystemIterationVersionExtension(id) {
      let res = await projectData.subsystemIterationVersionExtension(id);
      this.iteraction_version_extension = res.data.iteraction_version_extension;
      console.log(res);
    },
    toGraphical() {
      let count = 0,
        index = -1;
      for (let i in this.checkeds) {
        if (this.checkeds[i]) {
          count++;
          index = i;
        }
      }
      if (count == 1) {
        this.$router.push({
          path: "/version/index",
          query: { id: this.iteraction_version_extension[index].version_id },
        });
        return;
      }
      this.$notify.error({
        title: "错误",
        message: "必须勾选有且仅有一个选项",
      });
    },
  },
  created() {
    let id = window.location.href.split("id=")[1];
    this.subsystemIterationVersionExtension(id);
  },
};
</script>

<style scoped>
#data {
  margin: 50px 20px;
}
</style>
